{{template "base/base.html" .}}
{{template "base/base_common.html" .}}
{{define "meta"}}<title>{{i18n .Lang "auth.user_profile"}} - {{i18n .Lang "app_name"}}</title>{{end}}
{{define "body"}}
<div class="row">
    <div id="content">
        <div class="col-md-3">
            <div class="box">
                <ul class="nav nav-side">
                    <li class="cell first">
                        <h4 class="head"><i class="icon icon-cogs"></i> {{i18n .Lang "auth.user_settings"}}</h4>
                    </li>
                    <li class="active">
                        <a href="{{.AppUrl}}settings/profile">{{i18n .Lang "auth.user_profile"}}</a>
                    </li>
                    <li class="cell last">
                    </li>
                </ul>
            </div>
    	</div>
        <div class="col-md-9">
            <div class="box">
                <div class="cell first breadcrumb">
                    <a href="{{.AppUrl}}"><i class="icon icon-home"></i></a><i class="divider icon-angle-right"></i><a href="">{{i18n .Lang "auth.user_profile"}}</a>
                </div>
                <div class="cell last slim">
                    {{if .flash.NeedActive}}
                    <div class="alert alert-info">
                        <h4>{{i18n .Lang "auth.need_active"}}</h4>
                        {{i18n .Lang "auth.need_active_message"}}
                    </div>
                    {{else if .flash.RegSuccess}}
                    <div class="alert alert-success">
                        <h4>{{i18n .Lang "auth.register_success"}}</h4>
                        {{i18n .Lang "auth.register_success_message"}}
                    </div>
                    {{else if .flash.ProfileSave}}
                    <div class="alert alert-success">
                        {{i18n .Lang "auth.profile_saved"}}
                    </div>
                    {{else if .flash.PasswordSave}}
                    <div class="alert alert-success">
                        {{i18n .Lang "auth.password_changed"}}
                    </div>
                    {{else if .flash.ConnectSuccess}}
                    <div class="alert alert-success">
                        {{i18n .Lang "auth.sign_connect_success_to" .flash.ConnectSuccess}}
                    </div>
                    {{else if .flash.ConnectFailed}}
                    <div class="alert alert-success">
                        {{i18n .Lang "auth.sign_connect_error_to" .flash.ConnectFailed}}
                    </div>
                    {{end}}
                    <h3 class="underline">{{i18n .Lang "auth.base_profile"}}</h3>
                    <form method="POST" action="{{.AppUrl}}settings/profile">
                        {{.xsrf_html}}{{.once_html}}

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="profile-username">{{i18n .Lang "model.user_username"}}</label>
                                    <input id="profile-username" value="{{.User.UserName}}" type="text" class="form-control" disabled>
                                </div>
                            </div>
 
                            <div class="col-md-6">
                                {{template "base/form/field_group.html" .ProfileFormSets.Fields.NickName}}
                            </div>
                        </div>
 
                        <div class="row">
                            <div class="col-md-6">
                                {{with .ProfileFormSets.Fields.Email}}
                                <div class="form-group{{if .Error}} has-error{{end}}{{if not $.User.IsActive}} has-warning{{end}}">
                                    {{.Label}}
                                    {{call .Field}}
                                    <p class="error-block">
                                        {{if .Error}}{{.Error}}{{else}}
                                            {{if not $.User.IsActive}}{{i18n $.Lang "auth.please_verify_email"}}{{end}}
                                        {{end}}
                                    </p>
                                    {{if .Help}}<p class="help-block">{{.Help}}</p>{{end}}
                                </div>
                                {{end}}

                                {{template "base/form/field_group.html" .ProfileFormSets.Fields.PublicEmail}}

                                {{if .User.IsActive}}{{else}}
                                <div class="form-group">
                                    <button id="verify-mail-send" type="button" data-loading-text="{{i18n .Lang "auth.verify_email_sended"}}" class="btn btn-warning btn-xs">{{i18n .Lang "auth.send_verify_email"}}</button>
                                </div>
                                {{end}}
                            </div>

                            <div class="col-md-6">
                                {{template "base/form/field_group.html" .ProfileFormSets.Fields.Url}}
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                {{with .ProfileFormSets.Fields.GrEmail}}
                                <div class="form-group{{if .Error}} has-error{{end}}">
                                    {{.Label}}
                                    <div class="profile-avatar avatar" data-url="{{$.AvatarURL}}">
                                        <img src="{{$.AvatarURL}}{{.Value}}">
                                        <img src="{{$.AvatarURL}}{{.Value}}" class="middle">
                                        <img src="{{$.AvatarURL}}{{.Value}}" class="small">
                                    </div>
                                    {{call .Field}}
                                    {{if .Error}}<p class="error-block">{{.Error}}</p>{{end}}
                                    {{if .Help}}<p class="help-block">{{.Help}}</p>{{end}}
                                </div>
                                {{end}}

                            </div>

                            <div class="col-md-6">
                                {{template "base/form/field_group.html" .ProfileFormSets.Fields.Info}}
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                {{template "base/form/field_group.html" .ProfileFormSets.Fields.Company}}
                            </div>

                            <div class="col-md-6">
                                {{template "base/form/field_group.html" .ProfileFormSets.Fields.Location}}
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                {{template "base/form/field_group.html" .ProfileFormSets.Fields.Lang}}
                            </div>

                            <div class="col-md-6">
                                {{template "base/form/field_group.html" .ProfileFormSets.Fields.LangAdds}}
                            </div>
                        </div>

                        <h3 class="underline">{{i18n .Lang "auth.social_info"}}</h3>

                        <div class="row">
                            <div class="col-md-6">
                                {{with .ProfileFormSets.Fields.Github}}
                                    <div class="form-group{{if .Error}} has-error{{end}}">
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="icon-github-alt"></i></span>
                                            {{call .Field}}
                                        </div>
                                        {{if .Error}}<p class="error-block">{{.Error}}</p>{{end}}
                                        {{if .Help}}<p class="help-block">{{.Help}}</p>{{end}}
                                    </div>
                                {{end}}

                                {{with .ProfileFormSets.Fields.Weibo}}
                                    <div class="form-group{{if .Error}} has-error{{end}}">
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="icon-weibo"></i></span>
                                            {{call .Field}}
                                        </div>
                                        {{if .Error}}<p class="error-block">{{.Error}}</p>{{end}}
                                        {{if .Help}}<p class="help-block">{{.Help}}</p>{{end}}
                                    </div>
                                {{end}}

                                {{with .ProfileFormSets.Fields.Linkedin}}
                                    <div class="form-group{{if .Error}} has-error{{end}}">
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="icon-linkedin"></i></span>
                                            {{call .Field}}
                                        </div>
                                        {{if .Error}}<p class="error-block">{{.Error}}</p>{{end}}
                                        {{if .Help}}<p class="help-block">{{.Help}}</p>{{end}}
                                    </div>
                                {{end}}
                            </div>

                            <div class="col-md-6">
                                {{with .ProfileFormSets.Fields.Google}}
                                    <div class="form-group{{if .Error}} has-error{{end}}">
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="icon-google-plus"></i></span>
                                            {{call .Field}}
                                        </div>
                                        {{if .Error}}<p class="error-block">{{.Error}}</p>{{end}}
                                        {{if .Help}}<p class="help-block">{{.Help}}</p>{{end}}
                                    </div>
                                {{end}}

                                {{with .ProfileFormSets.Fields.Twitter}}
                                    <div class="form-group{{if .Error}} has-error{{end}}">
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="icon-twitter"></i></span>
                                            {{call .Field}}
                                        </div>
                                        {{if .Error}}<p class="error-block">{{.Error}}</p>{{end}}
                                        {{if .Help}}<p class="help-block">{{.Help}}</p>{{end}}
                                    </div>
                                {{end}}

                                {{with .ProfileFormSets.Fields.Facebook}}
                                    <div class="form-group{{if .Error}} has-error{{end}}">
                                        <div class="input-group">
                                            <span class="input-group-addon"><i class="icon-facebook"></i></span>
                                            {{call .Field}}
                                        </div>
                                        {{if .Error}}<p class="error-block">{{.Error}}</p>{{end}}
                                        {{if .Help}}<p class="help-block">{{.Help}}</p>{{end}}
                                    </div>
                                {{end}}
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <input type="hidden" name="action" value="save-profile">
                                    <button type="submit" class="btn btn-primary">{{i18n .Lang "auth.save_profile"}}&nbsp;&nbsp;<i class="icon-chevron-sign-right"></i></button>
                                </div>
                            </div>
                        </div>
                    </form>

                    <h3 class="underline">{{i18n .Lang "auth.reset_password"}}</h3>
                    <div class="row">
                        <div class="col-md-6">
                            <form method="POST" action="{{.AppUrl}}settings/profile">
                                {{.xsrf_html}}{{.once_html}}

                                {{template "base/form/fields.html" .PasswordFormSets}}

                                <div class="form-group">
                                    <input type="hidden" name="action" value="change-password">
                                    <button type="submit" class="btn btn-primary">{{i18n .Lang "auth.change_password"}}&nbsp;&nbsp;<i class="icon-chevron-sign-right"></i></button>
                                </div>
                            </form>
                        </div>
                    </div>
                    <div class="clearfix"></div>
                </div>
            </div>
        </div>
	</div>
</div>
<script type="text/javascript">
    (function($){
        $(document).on("click", "#verify-mail-send", function(){
            var $btn = $(this);
            $btn.button("loading");
            $.post("{{.AppUrl}}settings/profile", {action:"send-verify-email"}, function(data){
            });
        });
    })(jQuery);
</script>
{{end}}